<template>
	<view class="itemwrap">
		<view class="team-count">
			{{teamCount}}人组队成功
		</view>
		<image class="item-image" :src="src" mode=""></image>
		<view class="item-content">
			{{prizeName}}
	<!-- 	   <view class="item-info">
		   	
		   </view> -->
			<!-- <view class="item-info" style="margin-top: 12upx; margin-bottom: 20upx;">
			  	X{{prizeCount}}
			 </view> -->
		</view>
	</view>
</template>

<script>
	export default {
		name: 'prize-item',
		props: {
			//组队人数
			teamCount: {
		    type: String,
				default:'5'
			},
			//奖品图片
			src: {
				type: String,
				default: 'https://cdn.uviewui.com/uview/swiper/swiper1.png'
			},
			//奖品名称
			prizeName: {
				type: String,
				default: '飞利浦电动牙刷',
			},
			//奖品个数
			prizeCount: {
				type: String,
				default: '10'
			}
		}
	}
</script>

<style lang="scss" scoped>
	.itemwrap {
		background-color: #DCEAFB;
		border-radius: 20upx;
		width: 214upx;
		position: relative;
		.team-count {
			position: absolute;
			left: 0;
			top: 0;
			color: #fff;
			font-size: 18upx;
			padding: 10upx 15upx;
			background: linear-gradient(0deg,#ffb244 0%, #ffd58e 100%);
			border-radius: 20upx 0 20upx 0;
		}
		.item-image {
			width: 214upx;
			height: 214upx;
			border-radius: 20upx 20upx 0 0;

		}
		
	}
	
	.item-content {
		
		color: $main-color;
		font-size: 22upx;
		padding : 20upx 0;
		text-align: center;
	}
	

	
</style>
